.VideoContent{
  text-align: center;
  
  .videoWrap{
    position: relative;
    margin: 18px auto;
    width: 292px;
    height: 500px;
    .videoCanvas{
     
      border-radius: 24px;
    }
    .controls{
      width: calc(100%);
      height: 40px;
      position: absolute;
      bottom: 18px;
      left: 0px;
      // background-color: rgba(0,0,0,.3);
      padding: 0px 5px;
      box-sizing: border-box;
      // .slideBar{
      //   width: 100%;
      //   height: 6px;
      //   margin-top: -3px;
      //   box-sizing: border-box;
      //   background: #FFFFFF;
      //   border-radius: 5px;
      //   .blod{
      //     width: 30%;
      //     height: 100%;
      //     background: #3856FF;
      //     border-radius: 5px;
      //     position: relative;
      //     &::after{
      //       content: "";
      //       width: 12px;
      //       height: 12px;
      //       background: #3856FF;
      //       border-radius: 50%;
      //       position: absolute;
      //       top: 50%;
      //       margin-top: -6px;
      //       right: -6px;
      //   }
      //   }
        
      // }
      .controlBtns{
        width: 100%;
        height: auto;
        margin-top: 10px;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        background-color: #ccc;
        .paly_btn{
          width: 22px;
          height: 22px;
          cursor: pointer;
          img{
            width: 100%;
            height: 100%;
          }
        }
        .times{
          font-size: 14px;
          margin-left: 20px;
        }
      }
    }
   
  }
 
}